import { View, Text, Map, Button, Image } from "@tarojs/components";
import { useState, useEffect, useMemo } from "react";
import Taro, { useRouter, useDidShow } from "@tarojs/taro";

import { AtList, AtListItem, AtMessage } from "taro-ui";

import "./index.scss";

import { getProjectInfoApi } from "../../../utils/api";
import { btq, formatTime2 } from "../../../utils/to";
import { baseUrl } from "../../../utils/http";

const Project = () => {
  const router = useRouter();

  // 工程信息数据
  const [detailInfo, setDetailInfo] = useState({});
  const [lnglat, set_lnglat] = useState([]);

  // 1-未启用；2-启用；8-结束；9-废弃

  useDidShow(() => {
    getInfo();
  });

  // 获取详情
  const getInfo = async () => {
    const res = await getProjectInfoApi({
      project_id: router.params.id
    });
    if (res.msg === "成功") {
      setDetailInfo(res.record);
      console.log(res.record);
      set_lnglat(
        btq(res.record.longitude / 1000000, res.record.latitude / 1000000)
      );
    } else {
      Taro.atMessage({
        message: res.msg,
        type: "warning"
      });
    }
  };

  return (
    <View className="index">
      {detailInfo.image_path ? (
        <Image
          style="width: 100%;"
          mode="widthFix"
          src={baseUrl + detailInfo.image_path}
        />
      ) : (
        <View className="null">暂无工程图片</View>
      )}

      {detailInfo.name ? (
        <>
          <AtList>
            <AtListItem title="工程名称" extraText={detailInfo.name} />
            <AtListItem title="所属区域" extraText={detailInfo.area_name} />
            <AtListItem title="工程地址" extraText={detailInfo.address} />
            <AtListItem title="经度" extraText={lnglat[0]} />
            <AtListItem title="纬度" extraText={lnglat[1]} />
            <AtListItem title="描述" extraText={detailInfo.comment} />
            <AtListItem title="建筑面积" extraText={detailInfo.building_area} />
            <AtListItem title="幢数" extraText={detailInfo.building_number} />
            <AtListItem title="建设单位" extraText={detailInfo.constructor} />
            <AtListItem
              title="建设单位联系人"
              extraText={detailInfo.constructor_user}
            />
            <AtListItem
              title="建设单位电话"
              extraText={detailInfo.constructor_phone}
            />
            <AtListItem title="施工单位" extraText={detailInfo.builder} />
            <AtListItem
              title="施工单位联系人"
              extraText={detailInfo.builder_user}
            />
            <AtListItem
              title="施工单位电话"
              extraText={detailInfo.builder_phone}
            />
            <AtListItem
              title="开工日期"
              extraText={formatTime2(detailInfo.build_timestamp * 1000)}
            />
          </AtList>
        </>
      ) : null}
      <AtMessage />
    </View>
  );
};

export default Project;
